<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="renderer" content="webkit" />
  <meta name="robots" content="index, follow" />
  <title>KELLY RIGHT ™</title>
  <meta name="keywords" content="" />
  <meta name="description" content="" />
  <link rel="shortcut icon" href="skin/fonts/favicon.ico"/>
  <link rel="bookmark" href="skin/fonts/favicon.ico"/>
  <link rel="stylesheet" type="text/css" href="skin/css/font-awesome.css" media="screen" />
  <link rel="stylesheet" type="text/css" href="skin/css/bootstrap.min.css" media="screen" />
  <link rel="stylesheet" href="skin/css/bootstrap-datepicker3.css">
  <link rel="stylesheet" type="text/css" href="skin/css/owl.carousel.css" media="screen" />
  <link rel="stylesheet" type="text/css" href="skin/css/owl.theme.css" media="screen" />
  <link rel="stylesheet" type="text/css" href="skin/css/settings.css" media="screen" />
  <link rel="stylesheet" type="text/css" href="skin/css/style-red.css" media="screen" />
  <link rel="stylesheet" type="text/css" href="skin/css/tk.css" media="screen" />
  <script type="text/javascript" src="skin/js/jquery.min.js"></script>
  <script type="text/javascript" src="skin/js/jquery.autocomplete.js"></script>
  <script type="text/javascript" src="skin/js/bootstrap.min.js"></script>
  <script src="skin/js/bootstrap-datepicker.js"></script>
  <script type="text/javascript" src="skin/js/template-web.js"></script>
  <script type="text/javascript" src="skin/js/owl.carousel.min.js"></script>
  <!-- 列表 -->
  <script type="text/html" id="thelist">
    {{each list v i}}
    <!-- 渲染的地方 -->
    <div class="blog-article hentry format-image" id="xrlist">
     
      <div class="row list-item" data-id="{{v.mlsId}}">
        <div class="col-xs-12 col-sm-6 lrow">
          <!-- 左 图 -->
          <div class="figure">
            <img class="pic" alt="" src="{{v.photos[0]}}" />
          </div>
        </div>

        <div class="col-xs-12 col-sm-6 rrow">
          <!-- 右 信息 -->
          <div class="entry-summary post-summary">

            <div class="entry-meta post-meta">
              
              <!-- 上 -->
              <ul class="boxes">

                <li class="entry-date mn">${{v.listPrice}}</li>

                <li class="entry-date secli">{{v.address.full}}</li>

                <li class="tags1">
                  <ul class="bx cistate clearfix">
                    <li class="m">{{v.address.city}}</li>
                    <li class="m">{{v.address.state}}</li>
                  </ul>
                </li>

                <li class="byline author1 vcard">
                  <ul class="bx bbs clearfix">
                    {{ if (v.property.bedrooms) }}
                    <li class="m">{{v.property.bedrooms}} bd</li>
                    {{ /if }}

                    {{ if (v.property.bathsFull) }}
                    <li class="m">{{v.property.bathsFull}} ba</li>
                    {{ /if }}

                    {{ if (v.property.area)}}
                    <li class="m">{{v.property.area}} sf</li>
                    {{ /if }}
                  </ul>
                </li>
                 
                <li class="entry-date subtyoes">{{ v.property.subType ? v.property.subType : '' }}</li>

              </ul>
              
              <!-- 下 -->
              <div class="binfo">
                <ul class="bul clearfix">
                  {{ if (v.agent.photo) }}
                    <li class="pictu">
                      <img src="{{v.agent.photo}}" alt="" class="photo">
                    </li>
                  {{ /if }}
          

                  <li class="midder">
                    <p class="m-nm">{{v.agent.firstName}} {{v.agent.lastName}}</p>
                    <p class="m-company">{{v.office.servingName}}</p>
                  </li>

                  <li class="favioute" id="like">
                    {{if (v.isCollect != 1)}}
                    <img src="./skin/images/aixin.png" alt="">
                    {{else if(v.isCollect == 1)}}
                    <img src="./skin/images/aixin_full.png" alt="">
                    {{/if}}

                    <div class="mask" data-item="{{v}}"></div>
                  </li>
                </ul>
              </div>
            </div>

          </div>
        </div>
      </div>

    </div>
    {{/each}}
  </script>

  <!-- 所在页 pc -->
  <script type="text/html" id="pagePc">
    {{each szpage v i}}
    <span>
      <a href='./index.html' class="color">Real Estate for Sale</a>

      {{if (v.p1)}}
      <span class="dy"> > </span>
      {{/if}}

      <a href='javascript:void(0);' data-ke="{{v.p3}}" class="color thesear">{{v.p1}}</a>

      {{if (v.p8)}}
      <span class="dy"> > </span>
      {{/if}}

      {{if (v.p8)}}
      <span>{{v.p8}}</span>
      {{/if}}
    </span>
    {{/each}}
  </script>

  <!-- 所在页 mobile -->
  <script type="text/html" id="pageMobile">
    {{each szpage v i}}
    <span>
      <a href='./index.html' class="color">Real Estate for Sale</a>

      {{if (v.p1)}}
      <span class="dy"> > </span>
      {{/if}}

      <a href='javascript:void(0);' data-ke="{{v.p3}}" class="color thesear">{{v.p1}}</a>

      {{if (v.p2)}}
      <span class="dy"> > </span>
      {{/if}}

      {{if (v.p8)}}
      <span>{{v.p8}}</span>
      {{/if}}
    </span>
    {{/each}}
  </script>

  <!-- mls -->
  <script type="text/html" id="mls">
    {{each firstData1 v i}}
    <div class="rgh">
      <!-- matching '{{v.city}}' -->
      <h3 class="tit">MLS® Listings in {{v.p1}}{{if (v.p8)}}, {{v.p8}}{{/if}}
        <br>
        <span id="filterByN">
          <a class="links hidden-xs" href="javascript:void(0)">
            Filter by Neighbourhood
            <span class="link_indicator"></span>
          </a>
        </span>
      </h3>

      <!-- all -->
      <div class="clearfix hidden-xs all" id="allData">
        <div class="col-xs-12 col-sm-3">
          <ul class="list-ul">
            <li>
              <a class="item" href="">Mississauga All (35) </a>
            </li>
            <li><span class="span-item">Mavis-Erindale</span></li>
            <li><span class="span-item">Mississauga Valleys</span></li>
            <li><span class="span-item">Meadowvale Business Park</span></li>
            <li><span class="span-item">Lisgar</span></li>
            <li><span class="span-item">Meadowvale</span></li>
            <li><span class="span-item">Churchill Meadows</span></li>
            <li><span class="span-item">Meadowvale Village</span></li>
            <li><span class="span-item">Central Erin Mills</span></li>
          </ul>
        </div>

        <div class="col-xs-12 col-sm-3">
          <ul class="list-ul">
            <li><span class="span-item">Streetsville</span></li>
            <li><span class="span-item">East Credit</span></li>
            <li><span class="span-item">Gateway</span></li>
            <li><span class="span-item">Western Business Park</span></li>
            <li><span class="span-item">Erin Mills</span></li>
            <li><span class="span-item">Northeast</span></li>
            <li><span class="span-item">Hurontario</span></li>
            <li><span class="span-item">Erindale</span></li>
            <li><span class="span-item">Sheridan</span></li>
          </ul>
        </div>

        <div class="col-xs-12 col-sm-3">
          <ul class="list-ul">
            <li><span class="span-item">Sheridan Park</span></li>
            <li><span class="span-item">Creditview</span></li>
            <li><span class="span-item">Clarkson</span></li>
            <li><span class="span-item">Malton</span></li>
            <li><span class="span-item">Mississauga City Centre</span></li>
            <li><span class="span-item">Fairview</span></li>
            <li><span class="span-item">Southdown</span></li>
            <li><span class="span-item">Lorne Park</span></li>
            <li><span class="span-item">Cooksville</span></li>
          </ul>
        </div>

        <div class="col-xs-12 col-sm-3">
          <ul class="list-ul">
            <li><span class="span-item">Rathwood</span></li>
            <li><span class="span-item">Lakeview</span></li>
            <li><span class="span-item">Applewood</span></li>
            <li><span class="span-item">Airport Corporate</span></li>
            <li><span class="span-item">Mineola</span></li>
            <li><span class="span-item">Dixie</span></li>
            <li><span class="span-item active">Port Credit (35) </span></li>
          </ul>
        </div>

      </div>

      <div class="hidden-xs box">
        <div class="p">Your search returned {{v.total}} homes for sale in {{v.p1}}{{if (v.p8)}}, {{v.p8}}{{/if}}.
          You can further refine your search for {{v.p1}}{{if (v.p8)}}, {{v.p8}}{{/if}}
          real estate listings using the fields in the left column. Filter by price range, beds/baths, and property
          type, e.g., house, condo or land in {{v.p1}}{{if (v.p8)}}, {{v.p8}}{{/if}}.
        </div>
      </div>
      </span>
      {{/each}}
  </script>

  <!-- 分页 -->
  <script type="text/html" id="pagelist">
    {{if (pageList.length)}}
    <div id="pages">

      <ul class="boxs clearfix">

        <!-- 首页 -->
        {{ if (pageList.length > 1) }}
        <li class="items sypages">
          <a href='javascript:void(0);' class="homePage">
            <img src="./skin/images/zuoshuangjiantou.png" class="pic" alt="">
          </a>
        </li>
        {{/if}}

        <!-- 上1页 -->
        {{ if (pageList.length > 1) }}
        <li class="items">
          <a href='javascript:void(0);' class="larr">
            <img src="./skin/images/zuojiantou.png" class="pic" alt="">
          </a>
        </li>
        {{/if}}

        <!-- 页码 -->
        {{each pageList v i}}
        {{ if (pageList.length <= 4) }}

        {{if (i == 0)}}
        <li class="items tpage active">
          <a href="javascript:void(0);">{{v}}</a>
        </li>
        {{ else if (i > 0) }}

        <li class="items tpage">
          <a href="javascript:void(0);">{{v}}</a>
        </li>
        {{/if}}

        {{ else if (pageList.length > 4) }}
        {{if i < 2}}
        {{ if (i == 0) }}
        <li class="items tpage active">
          <a href="javascript:void(0);">{{v}}</a>
        </li>
        {{ else if (i != 0)}}
        <li class="items tpage">
          <a href="javascript:void(0);">{{v}}</a>
        </li>
        {{ /if }}
        {{/if}}

        {{if i == 2}}
        <li class="items tpage">
          <a href="javascript:void(0);">...</a>
        </li>
        {{/if}}

        {{if i == pageList.length-1}}
        <li class="items tpage">
          <a href="javascript:void(0);">{{i+1}}</a>
        </li>
        {{/if}}

        {{ /if }}

        {{/each}}

        <!-- 下1页 -->
        {{ if (pageList.length > 1) }}
        <li class="items">
          <a href='javascript:void(0);' class="rarr">
            <img src="./skin/images/youjiantou.png" class="pic" alt="">
          </a>
        </li>
        {{/if}}

        <!-- 末页 -->
        {{ if (pageList.length > 1) }}
        <li class="items mypage">
          <a href='javascript:void(0);' class="lastPage">
            <img src="./skin/images/youshuangjiantou.png" class="pic" alt="">
          </a>
        </li>
        {{/if}}

      </ul>

    </div>
    {{/if}}
  </script>

  <!-- filters中 type -->
  <script type="text/html" id="properTy">
    <option value="">Any property type</option>
    {{each proType v i}}
    <option value="{{v}}">{{v}}</option>
    {{/each}}
  </script>

  <!-- 随机列表 -->
  <script type="text/html" id="randoms">
    <ul class="widget-list">
      {{each rlist v i}}
        <li class="item" data-id="{{v.mlsId}}">
          <div class="pictures">
            <img src="{{v.photos[0]}}" />
          </div>

          <div class="sn-wrapper">
            <div class="money">${{v.listPrice}}</div>
            <div class="street">{{v.address.full}}</div>
            <div class="areas">{{v.address.city}} <span class="sp">|</span> {{v.address.state}}</div>
            <div class="agentNm">{{v.agent.firstName}} {{v.agent.lastName}}</div>
            <div class="compay">{{v.office.servingName}}</div>
          </div>
        </li>
      {{/each}}
    </ul>

  </script>

  <script type="text/html" id="randomTitle">
    {{each titleList v i}}
      {{ if v.num }}
        <h3 class="title">{{v.title}}</h3>
      {{ /if }}
    {{/each}}
  </script>


</head>

<body>
  <div id="container" class="houselist" style="background: #F9FBFC;">
    <!-- 导航栏 -->
    <header class="clearfix" id="header-sec">
      <nav class="navbar navbar-default navbar-fixed-top pbox" role="navigation">

        <div class="container-fluid">

          <!-- 左 logo -->
          <div class="navbar-header">
            <!-- 移动端按钮 -->
            <a class="navbar-toggle collapsed mmenu-btn" href="#mmenu">
              <!-- <span class="sr-only">Toggle navigation</span>
                  <span class="icon-bar"></span> 
                  <span class="icon-bar"></span> 
                  <span class="icon-bar"></span>  -->
              <img src="./skin/images/mobile-qttab.png" alt="">
            </a>

            <!-- <a class="navbar-brand" href="javascript:;">
              <img src="./skin/images/logo.png" alt="" class="logo" />
            </a> -->

            <!-- pc -->
            <a class="navbar-brand hidden-xs hidden-sm hiddenMobEle" href="javascript:;">
              <img src="./skin/images/logo.png" alt="" class="logo" />
            </a>

            <!-- 移动 -->
            <a class="navbar-brand hidden-md hidden-lg hiddenPccEle" href="javascript:;">
              <img src="./skin/images/log-logo.png" alt="" class="logo" />
            </a>

          </div>

          <!-- tab -->
          <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">

            <ul class="nav navbar-nav navbar-left" id="navigation1">
              <li class="Lev1">
                <a href="./index.html" class='menu1 active'>Homes for Sale </a>
              </li>

              <li class="Lev1">
                <a href="./aboutCharlotte.html" class='menu1'>About Charlotte</a>
              </li>

              <li class="Lev1">
                <a href="./contactUs.html" class='menu1'>Contact Us</a>
              </li>

              <!-- <li class="Lev1">
                    <a href="./openHouses.html" class="menu1">Open Houses</a>
                  </li> -->

              <!-- <li class="Lev1">
                    <a href="javascript:void(0);" class="menu1">New Developments</a>
                  </li>
    
                  <li class="Lev1">
                    <a href="javascript:void(0);" class="menu1">Buildings
                    </a>
    
                  </li>
    
                  <li class="Lev1">
                    <a href="javascript:void(0);" class="menu1">Find an Agent
                    </a>
    
                  </li>
    
                  <li class="Lev1">
                    <a href="javascript:void(0);" class="menu1">Blog
                    </a>
                  </li> -->
            </ul>

            <ul class="nav navbar-nav navbar-right" id="navigation2">

              <li class="Lev1">
                <a href="./sign-up.html" class="menu1 giwid firsta">SIGN UP</a>
              </li>

              <li class="Lev1">
                <a href="javascript:void(0);" class="menu1 giwid activeLogin active">LOG IN</a>
              </li>

              <li class="afterLogin" style="display: none">
                <a class="ele-a" href="#">
                  <!-- 注册时输入的用户名 -->
                  <span class="atext">username</span>
                  <div class="arr-down">
                    <img src="./skin/images/jiantouxia.png" alt="">
                  </div>
                </a>

                <!-- 用户相关 -->
                <ul class="aboutUser">
                  <li class="item">
                    <a href="./account-details.html" class="in">
                      <span class="">Account Details</span>
                    </a>
                  </li>

                  <li class="item" id="userFavourite">
                    <a href="./collection.html" class="in">
                      <span class="">Favorites</span>
                      <span class="favNum">0</span>
                    </a>
                  </li>

                  <li class="item">
                    <p class="signOut">Sign Out</p>
                  </li>
                </ul>

              </li>

            </ul>

          </div>

        </div>

      </nav>
    </header>

    <!-- sign in -->
    <div class="signin none">
      <div class="content">
        <!-- 关闭 -->
        <div class="closebtn"></div>

        <!-- logo -->
        <div class="dllogos">
          <div class="photo">
            <img src="./skin/images/log-logo.png" class="thepicture" alt="">
          </div>
        </div>

        <!-- 提示登录 -->
        <!-- <div class="tsinfo">Please login to your account before seeing the information. </div> -->

        <!-- 用户 -->
        <div class="userinfo login-normal" id="userInfo">
          <form action="">
            <!-- 导航 -->
            <div class="row navbares" id="signNav">

              <div class="col-xs-4 col-xs-offset-4 col-sm-2 col-sm-offset-7 up">
                <span>Sign Up</span>
              </div>

              <div class="col-xs-4 col-sm-2 log active">
                <span>Log In</span>
              </div>

            </div>

            <!-- sign up -->
            <div class="row usersignup">
              <!-- <div class="row free">
                  Create a FREE account to save searches and track your favourite homes. Already have an account? Click
                  the Log In tab.
                </div> -->

              <!-- 提示 -->
              <div class="row upalert" id="upginTips">You have signed up successfully, please log in to account.</div>

              <div class="row name">
                <div class="title">Name</div>
                <input type="text" placeholder="" name="" id="input_name1">
                <div class="ts">cannot be blank</div>
              </div>

              <div class="row email">
                <div class="title">Email</div>
                <input type="email" placeholder="" name="" id="input_email1">
                <div class="ts">please enter the correct email</div>
                <div class="exist">account already exists</div>
              </div>

              <div class="row password">
                <div class="title">Phone Number <span class="usedfor">(Used for Password)</span></div>
                <input type="text" placeholder="" name="" id="input_password1">
                <div class="ts">cannot be blank</div>
              </div>

              <!-- <div class="row confirm">
                  <div class="title">Confirm Password</div>
                  <input type="password" placeholder="" name="" id="input_confirm1">
                  <div class="ts">does not match password</div>
                </div> -->

              <!-- 确定 -->
              <div class="row upsubmit">
                <p class="tj active">Sign Up</p>
              </div>

              <div class="row confirm2">
                <!-- <input type="checkbox" name="" value="0" id=""> -->
                <div class="pictur active"></div>
                Get emailed when we find more properties that suit your tastes! We'll notify you daily of new listings
                &
                price changes.
              </div>

              <div class="row bottomTiS">
                By clicking continue or sign up, you agree to our linked <span class="hs">Terms of
                  Use</span> and <span class="hs">Privacy Policy</span>
              </div>
            </div>

            <!-- log in -->
            <div class="row usersignin">
              <!-- <div class="row tit">
                  <p>
                    Don't have an account? Click on the Sign Up tab.
                  </p>
                </div> -->

              <!-- 提示 -->
              <div class="row alert" id="loginTips">Invalid email or password.</div>

              <div class="row email">
                <div class="title">Email</div>
                <input type="email" name="" placeholder="" id="input_email">
                <div class="ts">Please enter the correct email</div>
              </div>

              <div class="row password">
                <div class="title">Phone Number <span class="usedfor">(Used for Password)</span></div>
                <input type="text" name="" placeholder="" id="input_password">
                <div class="ts">cannot be blank</div>
              </div>

              <div class="row loginsubmits">
                <p class="tj active">Log In</p>
              </div>

              <!-- 是否保持状态 忘记密码 -->
              <div class="row combine">
                <!-- 保持状态 -->
                <div class="col-xs-12 col-sm-6 rad">
                  <!-- <input type="checkbox" value="0" name="agree" id="check"> -->
                  <div class="pictur active"></div>
                  Stay logged in
                </div>

                <div class="col-xs-12 col-sm-6 access">
                  <p>
                    <a href="javascript: void(0);" id="forgetword">Can't access your account?</a>
                  </p>
                </div>

              </div>


            </div>

          </form>

        </div>

        <!-- 忘记密码 -->
        <div class="row findpassword login-find" style="display: none;">
          <div class="row tit">
            <p>
              Enter the email address you registered with and your password will be sent to you.
            </p>
          </div>

          <!-- 提示 -->
          <div class="row alert" id="findpaTips">Invalid email.</div>

          <div class="row email" id="emaFi">
            <div class="title">Email</div>
            <input type="email" name="" placeholder="" id="sendEmail">
            <div class="ts">Please enter the correct email.</div>
          </div>

          <div class="row send" id="sendPass">
            <p class="tj active">Send Password</p>
          </div>

          <div class="row back">
            <p>
              <a href="javascript: void(0);">Back to log in page</a>
            </p>
          </div>

        </div>

      </div>
    </div>

    <!-- filter -->
    <div class="filter">
      <section>
        <form action="" class="forms">
          <div class="row" style="margin: 0;" id="filter-condition">

            <!-- Property Type -->
            <div class="col-xs-12" id="filter-type1">
              <section>
                <div class="row propertyType">
                  <div class="group">
                    <label class="control-label select optional filters-label"
                      for="property_search_property_type">Property Type:</label>
                    <div class="controls">
                      <select class="form-control" id="filter-type1-select"></select>
                    </div>
                  </div>
                </div>
              </section>
            </div>

            <!-- Price from -->
            <div class="col-xs-6 pfrom columns" id="filter-type2">
              <div class="Price">
                <label class="control-label" for="property_search_list_price_from">Price from:</label>
                <div class="controls">
                  <select class="form-control" id="filter-type2-priceFrom">
                    <option value="">Any Min Price</option>
                    <option value="200000">$200,000</option>
                    <option value="250000">$250,000</option>
                    <option value="300000">$300,000</option>
                    <option value="350000">$350,000</option>
                    <option value="400000">$400,000</option>
                    <option value="450000">$450,000</option>
                    <option value="500000">$500,000</option>
                    <option value="550000">$550,000</option>
                    <option value="600000">$600,000</option>
                    <option value="650000">$650,000</option>
                    <option value="700000">$700,000</option>
                    <option value="750000">$750,000</option>
                    <option value="800000">$800,000</option>
                    <option value="850000">$850,000</option>
                    <option value="900000">$900,000</option>
                    <option value="950000">$950,000</option>
                    <option value="1000000">$1,000,000</option>
                    <option value="1100000">$1,100,000</option>
                    <option value="1200000">$1,200,000</option>
                    <option value="1300000">$1,300,000</option>
                    <option value="1500000">$1,500,000</option>
                    <option value="1750000">$1,750,000</option>
                    <option value="2000000">$2,000,000</option>
                    <option value="2500000">$2,500,000</option>
                    <option value="3000000">$3,000,000</option>
                    <option value="4000000">$4,000,000</option>
                    <option value="5000000">$5,000,000</option>
                  </select>
                </div>
              </div>
            </div>

            <!-- Price to -->
            <div class="col-xs-6 columns" id="filter-type3">
              <div class="form-group">
                <label class="" for="property_search_list_price_to">Price to:</label>
                <div class="controls">
                  <select class="form-control" id="filter-type3-priceTo">
                    <option value="">Any Max Price</option>
                    <option value="200000">$200,000</option>
                    <option value="250000">$250,000</option>
                    <option value="300000">$300,000</option>
                    <option value="350000">$350,000</option>
                    <option value="400000">$400,000</option>
                    <option value="450000">$450,000</option>
                    <option value="500000">$500,000</option>
                    <option value="550000">$550,000</option>
                    <option value="600000">$600,000</option>
                    <option value="650000">$650,000</option>
                    <option value="700000">$700,000</option>
                    <option value="750000">$750,000</option>
                    <option value="800000">$800,000</option>
                    <option value="850000">$850,000</option>
                    <option value="900000">$900,000</option>
                    <option value="950000">$950,000</option>
                    <option value="1000000">$1,000,000</option>
                    <option value="1100000">$1,100,000</option>
                    <option value="1200000">$1,200,000</option>
                    <option value="1300000">$1,300,000</option>
                    <option value="1500000">$1,500,000</option>
                    <option value="1750000">$1,750,000</option>
                    <option value="2000000">$2,000,000</option>
                    <option value="2500000">$2,500,000</option>
                    <option value="3000000">$3,000,000</option>
                    <option value="4000000">$4,000,000</option>
                    <option value="5000000">$5,000,000</option>
                  </select>
                </div>
              </div>
            </div>

            <!-- Bedrooms -->
            <div class="col-xs-6 columns" id="filter-type4">
              <div class="form-group">
                <label class="control-label" for="property_search_num_bedrooms">Bedrooms:</label>
                <div class="controls">
                  <select class="form-control" id="filter-type4-bedrooms">
                    <option value="">Any beds</option>
                    <!-- <option value="0">Studio</option> -->
                    <option value="1">1+ beds</option>
                    <option value="2">2+ beds</option>
                    <option value="3">3+ beds</option>
                    <option value="4">4+ beds</option>
                    <option value="5">5+ beds</option>
                  </select>
                </div>
              </div>
            </div>

            <!-- Bathrooms -->
            <div class="col-xs-6 columns" id="filter-type5">
              <div class="form-group">
                <label class="control-label" for="property_search_num_bathrooms">Bathrooms:</label>
                <div class="controls">
                  <select class="form-control" id="filter-type5-bathrooms">
                    <option value="">Any baths</option>
                    <option value="1">1+ baths</option>
                    <option value="2">2+ baths</option>
                    <option value="3">3+ baths</option>
                    <option value="4">4+ baths</option>
                    <option value="5">5+ baths</option>
                  </select>
                </div>
              </div>
            </div>

            <!-- Sq. Feet from -->
            <div class="col-xs-6 columns" id="filter-type6">
              <div class="form-group">
                <label class="" for="property_search_total_floor_area_from">Sq. Feet from:</label>
                <div class="controls">
                  <select class="form-control" id="filter-type6-sqFrom">
                    <option value="">Any Min SqFt</option>
                    <option value="500">500</option>
                    <option value="750">750</option>
                    <option value="1000">1,000</option>
                    <option value="1250">1,250</option>
                    <option value="1500">1,500</option>
                    <option value="1750">1,750</option>
                    <option value="2000">2,000</option>
                    <option value="2250">2,250</option>
                    <option value="2500">2,500</option>
                    <option value="2750">2,750</option>
                    <option value="3000">3,000</option>
                    <option value="3250">3,250</option>
                    <option value="3500">3,500</option>
                    <option value="4000">4,000</option>
                    <option value="4500">4,500</option>
                    <option value="5000">5,000</option>
                    <option value="6000">6,000</option>
                    <option value="7000">7,000</option>
                    <option value="8000">8,000</option>
                    <option value="9000">9,000</option>
                    <option value="10000">10,000</option>
                  </select>
                </div>
              </div>
            </div>

            <!-- Sq. Feet to -->
            <div class="col-xs-6 columns" id="filter-type7">
              <div class="form-group">
                <label class="" for="property_search_total_floor_area_to">Sq. Feet to:</label>
                <div class="controls">
                  <select class="form-control" id="filter-type7-sqTo">
                    <option value="">Any Max SqFt</option>
                    <option value="500">500</option>
                    <option value="750">750</option>
                    <option value="1000">1,000</option>
                    <option value="1250">1,250</option>
                    <option value="1500">1,500</option>
                    <option value="1750">1,750</option>
                    <option value="2000">2,000</option>
                    <option value="2250">2,250</option>
                    <option value="2500">2,500</option>
                    <option value="2750">2,750</option>
                    <option value="3000">3,000</option>
                    <option value="3250">3,250</option>
                    <option value="3500">3,500</option>
                    <option value="4000">4,000</option>
                    <option value="4500">4,500</option>
                    <option value="5000">5,000</option>
                    <option value="6000">6,000</option>
                    <option value="7000">7,000</option>
                    <option value="8000">8,000</option>
                    <option value="9000">9,000</option>
                    <option value="10000">10,000</option>
                  </select>
                </div>
              </div>
            </div>

            <!-- Year built from -->
            <div class="col-xs-6 columns" id="filter-type8">
              <div class="form-group">
                <label class="" for="property_search_year_built_from">Year built from</label>
                <div class="controls">
                  <select class="form-control" id="filter-type8-yearFrom">
                    <option value="">Any Min Year</option>
                    <option value="2019">2019</option>
                    <option value="2018">2018</option>
                    <option value="2017">2017</option>
                    <option value="2016">2016</option>
                    <option value="2015">2015</option>
                    <option value="2014">2014</option>
                    <option value="2013">2013</option>
                    <option value="2012">2012</option>
                    <option value="2011">2011</option>
                    <option value="2010">2010</option>
                    <option value="2005">2005</option>
                    <option value="2000">2000</option>
                    <option value="1995">1995</option>
                    <option value="1990">1990</option>
                    <option value="1980">1980</option>
                    <option value="1970">1970</option>
                    <option value="1960">1960</option>
                    <option value="1950">1950</option>
                    <option value="1900">1900</option>
                  </select>
                </div>
              </div>
            </div>

            <!-- Year built to -->
            <div class="col-xs-6 columns" id="filter-type9">
              <div class="form-group">
                <label class="" for="property_search_year_built_to">Year built to</label>
                <div class="controls">
                  <select class="form-control" id="filter-type9-yearTo">
                    <option value="">Any Max Year</option>
                    <option value="2019">2019</option>
                    <option value="2018">2018</option>
                    <option value="2017">2017</option>
                    <option value="2016">2016</option>
                    <option value="2015">2015</option>
                    <option value="2014">2014</option>
                    <option value="2013">2013</option>
                    <option value="2012">2012</option>
                    <option value="2011">2011</option>
                    <option value="2010">2010</option>
                    <option value="2005">2005</option>
                    <option value="2000">2000</option>
                    <option value="1995">1995</option>
                    <option value="1990">1990</option>
                    <option value="1980">1980</option>
                    <option value="1970">1970</option>
                    <option value="1960">1960</option>
                    <option value="1950">1950</option>
                    <option value="1900">1900</option>
                  </select>
                </div>
              </div>
            </div>

            <!-- Keywords -->
            <!-- <div class="col-xs-12 Keywords columns" id="filter-type10">
              <div class="form-group">
                <label class="control-label" for="property_search_options">Keywords</label>
                <div class="inp">
                  <input class="" placeholder="Keywords (ie: pool, views, penthouse)" type="text" id="theinput">
                </div>
              </div>
            </div> -->

          </div>

          <!-- Only Open Houses -->
          <div class="row" id="filter-btn">
            <div class="col-xs-12 ">
              <div class="row">
                <div class="col-xs-12">

                  <div class="filtertoggle">
                    <label class="checkboxtoggle-label">
                      Only Open Houses
                      <div class="pull-right boxs">
                        <!-- 开关 -->
                        <div class="switches">
                          <div class="checkboxtoggle-button"></div>
                        </div>
                      </div>
                    </label>
                  </div>
                </div>

                <div class="col-xs-12 Results">
                  <p id="filter-submit" class="btn">Filter Results</p>
                </div>
              </div>
            </div>
          </div>
        </form>

        <div class="offcanvas-backdrop"></div>
      </section>

    </div>

    <!-- 随机匹配时提示 -->
    <div class="randomMatching">
      <div class="container tobox">
        <div class="row">
          <div class="col-xs-12">
            <div class="bgfill">
              <div class="media">
                <div class="media-body">
                  Sorry, no current listings match your search. Here is a neighborhood you might be interested in.
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <!-- 所在页 -->
    <div class="breadcrumb-wrapper">
      <div class="container" id="pagesinthe">
        <div class="row tline">
          <!-- 位置 -->
          <div class="col-sm-7 col-md-8 hidden-xs location">
            <div class="pc-location" id="l-pc">
            </div>
          </div>

          <!-- 搜索 -->
          <div class="col-sm-5 col-md-4 bcid-cat">
            <input type="text" class="sr" name="country" id="autocomplete1" placeholder="Neighborhood, Address, School">
            <div class="rig" id="sale-searchbtn">
              <i class="fa fa-search icon"></i>
            </div>
            <!-- 智能提示 -->
            <div id="suggestions-container" class="tsboxs" style=""></div>
          </div>

          <!-- 移动端 位置 -->
          <div class="col-sm-7 col-md-8 hidden-sm hidden-md hidden-lg location">
            <div class="mobile-location" id="l-mobile">
            </div>
          </div>

        </div>
      </div>
    </div>

    <!-- 内容 -->
    <div class="page-container mainpage saleMain" id="innerpage-wrap">
      <div class="container">

        <div class="row">

          <!-- 左 列表 -->
          <div class="main col-xs-12 col-md-8 inner-left" role="main">
            <!-- MLS -->
            <div class="mls" id="mlsbox"></div>

            <!-- 筛选 -->
            <div class="sort clearfix" id="thesort">
              <!-- sort -->
              <ul class="box clearfix" id="sortBoxes">
                <li class="hidden-xs hidden-sm">Sort</li>
                <li class="msort hidden-md hidden-lg">Sort</li>

                <!-- <li class="active sort-item hidden-xs hidden-sm sort-featured">
                  <a href="javascript:void(0);">Featured</a>
                  <div class="sortArr"></div>
                </li> -->
                <li class="active hidden-xs sort-item hidden-sm sort-latest" id="sLatest">
                  <a href="javascript:void(0);">Latest</a>
                  <div class="sortArr link"></div>
                </li>

                <li class="hidden-xs sort-item hidden-sm sort-price" id="sPrice">
                  <a href="javascript:void(0);">Price</a>
                  <div class="sortArr"></div>
                </li>

                <li class="sort-item hidden-xs hidden-sm sort-bd" id="sBd">
                  <a href="javascript:void(0);">Bd</a>
                  <div class="sortArr"></div>
                </li>

                <li class="sort-item hidden-xs hidden-sm sort-ba" id="sBa">
                  <a href="javascript:void(0);">Ba</a>
                  <div class="sortArr"></div>
                </li>
                <!-- <li class="hidden-xs sort-item hidden-sm sort-sqft" id="sSqft">
                  <a href="javascript:void(0);">Sqft</a>
                  <div class="sortArr"></div>
                </li> -->
              </ul>

              <!-- save see map -->
              <ul class="box1 clearfix">
                <li id="filter"><a href="javascript:void(0);">Filter</a></li>
                <!-- <li class="save">Save</li> -->
                <li class="map" id="seeListMap">
                  <img src="./skin/images/dingwei.png" alt="">
                  See Map
                </li>
              </ul>

              <!-- 移动端 -->
              <ul class="selectBx" id="mobileSort">
                <!-- <div class="item">
                  <a href="javasctipt: void(0);">
                    Featured
                  </a>
                </div> -->

                <div class="item active item1" id="mLatest">
                  <a href="javasctipt: void(0);">
                    Latest
                  </a>
                </div>

                <div class="item item2" id="mPrice">
                  <a href="javasctipt: void(0);">
                    Price
                  </a>
                </div>

                <div class="item item3" id="mBd">
                  <a href="javasctipt: void(0);">
                    Bd
                  </a>
                </div>

                <div class="item item5" id="mBa">
                  <a href="javasctipt: void(0);">
                    Ba
                  </a>
                </div>

                <!-- <div class="item">
                  <a href="javasctipt: void(0);">
                    Sqft
                  </a>
                </div> -->

              </ul>

            </div>

            <!-- 展示 -->
            <article class="blog-wrap" id="listbox"></article>
            <!-- 无数据 -->
            <div class="nolist" id="noData1">no data</div>

            <!-- 分页 -->
            <div class="pagination-wrap" id="pageing"></div>
          </div>

          <!-- 右 侧边 -->
          <div class="sidebar col-xs-12 col-md-4 inner-right" role="complementary" id="listright">
            <div class="widget side-news">
              <!-- 客户 -->
              <div class="applyes">
                <!-- 人员 -->
                <div class="title row">
                  <div class="col-xs-4 lpic">
                    <img src="./skin/images/customer.jpg" class="ig" alt=""/>
                  </div>
                  <div class="col-xs-8 rinfo">
                    <!-- <p class="fz">Salesperson</p> -->
                    <p class="link">Charlotte Wolverton, Broker</p>
                    <!-- <p class="">www.charlottewolverton.com,</p> -->
                    <p>ASP, CNHS, CRS, GRI, PSA, RCC</p>
                    <p>Kelly Right Real Estate</p>
                    <p class="link link1" id="view-agentPhone">M: <a class="tells" href="tel: 509-747-SOLD">509-747-SOLD</a> (7653)</p>
                  </div>
                </div>

                <!-- write -->
                <div class="write" id="sendConsults">
                  <form action="">
                    <div class="item" id="selectDate">
                      <div class="cox-xs-12 commoDates">

                        <input data-provide="datepicker" id="f-date" class="in" placeholder="Preferred Date">
                        <div class="ts">cannot be blank</div>

                      </div>
                    </div>

                    <div class="item" id="myNameS">
                      <div class="cox-xs-12">
                        <input type="text" id="f-name" value="" class="in" placeholder="Name*" />
                        <div class="ts">cannot be blank</div>
                      </div>
                    </div>

                    <div class="item" id="myEmailS">
                      <div class="cox-xs-12">
                        <input type="text" id="f-email" value="" class="in" placeholder="Email*" />
                        <div class="ts">cannot be blank</div>
                      </div>
                    </div>

                    <div class="item" id="myPhoneS">
                      <div class="cox-xs-12">
                        <input type="text" id="f-phone" class="in" placeholder="Phone Number" />
                        <div class="ts">cannot be blank</div>
                      </div>
                    </div>

                    <div class="item rad">
                      <div class="cox-xs-12 isrobottbox">
                        <input type="checkbox" name="" id="bot" class="isrobott">
                        <label class="lab" for="bot">I am not a robot</label>
                      </div>
                    </div>

                    <div class="item submit" id="subSend">
                      <div class="cox-xs-12">
                        <input type="button" value="Submit Viewing Request" class="in" />
                      </div>
                    </div>

                  </form>
                </div>
              </div>
               
              <div class="listTitle" id="sjTit"></div>
              
              <!-- 随机列表 -->
              <div class="tabbed custom-tabbed">
                <div class="block current" id="sjrandlist"></div>
              </div>

            </div>

          </div>

        </div>
      </div>
    </div>

    <!-- 免责 -->
    <div class="disclaimer">
      <div class="media">
        <div class="media-body">
          Listings made available courtesy of the Spokane Association of REALTORS®MLS. Copyright 2019 of the Spokane
          Association of REALTORS®MLS. All rights reserved.
          <br />
          IDX Data is provided exclusively for consumers' personal, non-commercial use, it may not be used for any
          purpose other than to identify prospective properties consumers may be interested in purchasing, data is
          deemed reliable but is not guaranteed accurate by the Spokane Association of REALTORS®MLS.
        </div>
      </div>
    </div>

    <!-- 底部 -->
    <div class="commonfoot">
      <div class="container  hidden-xs hidden-sm">

        <div class="row">

          <div class="col-md-4 col-lg-4  foot-contact rightbox">
            <div class="f-contact ltxt">
              <p> <a href="javascript:void(0);">© 2019 Real Estate Website by DotCom Agents</a></p>
              <p> <a href="javascript:void(0);">All rights reserved. Privacy and Terms</a></p>
            </div>
          </div>

          <div class="col-md-4 col-lg-4 foot-contact">
            <div class="f-contact">
              <ul class="box clearfix">
                <li>
                  <a href="javascript:void(0);">
                    <img src="./skin/images/bottom1.png" alt="" class="pic">
                  </a>
                </li>
                <li>
                  <a href="javascript:void(0);">
                    <img src="./skin/images/bottom2.png" alt="" class="pic">
                  </a>
                </li>
                <li>
                  <a href="javascript:void(0);">
                    <img src="./skin/images/bottom3.png" alt="" class="pic">
                  </a>
                </li>
              </ul>
            </div>
          </div>

          <div class="col-md-4 col-lg-4 foot-contact">
            <div class="f-contact rtxt">
              <p> <a href="./aboutCharlotte.html">ABOUT US</a></p>
              <p> <a href="./contactUs.html">CONTACT US</a></p>
            </div>
          </div>

        </div>

      </div>

      <div class="container hidden-md  hidden-lg">

        <div class="row">

          <div class="col-xs-12 col-sm-12 foot-contact">
            <div class="f-contact one">
              <ul class="about clearfix">
                <li><a href="./aboutCharlotte.html">ABOUT US</a></li>
                <li><a href="./contactUs.html">CONTACT US</a></li>
              </ul>
            </div>
          </div>

          <div class="col-xs-12 col-sm-12 foot-contact">
            <div class="f-contact two">
              <ul class="box clearfix">
                <li>
                  <a href="javascript:void(0);">
                    <img src="./skin/images/bottom1.png" alt="" class="pic">
                  </a>
                </li>
                <li>
                  <a href="javascript:void(0);">
                    <img src="./skin/images/bottom2.png" alt="" class="pic">
                  </a>
                </li>
                <li>
                  <a href="javascript:void(0);">
                    <img src="./skin/images/bottom3.png" alt="" class="pic">
                  </a>
                </li>
              </ul>
            </div>
          </div>

          <div class="col-xs-12 col-sm-12  foot-contact">
            <div class="f-contact three">
              <p> <a href="javascript:void(0);">© 2019 Real Estate Website by DotCom Agents</a></p>
              <p> <a href="javascript:void(0);">All rights reserved. Privacy and Terms</a></p>
            </div>
          </div>
        </div>

      </div>
    </div>

    <!-- 返回顶部 -->
    <div class="commongoback" id="toTop">
      <div class="icon">
        <img src="./skin/images/up.png" />
      </div>
      top
    </div>

    <!-- 加载中 -->
    <div class="load">
      <div class="ing">
        <img src="./skin/images/jiazaizhong.gif" class="photo" alt="">
      </div>
    </div>

    <!-- 提示: 通用 -->
    <div class="commonTips">
      <img class="pic" src="./skin/images/dui.png" alt="">
      <span class="txt">The submission of the view request was successful.</span>
      <div class="close">
        <img src="./skin/images/guanbi.png" alt="">
      </div>
    </div>

    <!-- 提示: 登录成功 -->
    <div class="success-logIn">
      <img class="pic" src="./skin/images/dui.png" alt="">
      <span class="txt">Logged in successfully.</span>
      <div class="close">
        <img src="./skin/images/guanbi.png" alt="">
      </div>
    </div>

    <!-- 提示: 退出成功 -->
    <div class="success-signOut">
      <img class="pic" src="./skin/images/dui.png" alt="">
      <span class="txt">Signed out successfully.</span>
      <div class="close">
        <img src="./skin/images/guanbi.png" alt="">
      </div>
    </div>

    <!-- 提示: 到邮箱找回密码 -->
    <div class="findmailbox">
      <img class="pic" src="./skin/images/dui.png" alt="">
      <span class="txt">You will receive an email with instructions about how to reset your password in a few
        minutes.</span>
      <div class="close">
        <img src="./skin/images/guanbi.png" alt="">
      </div>
    </div>

  </div>
  <script type="text/javascript" src="skin/js/jquery.migrate.js"></script>
  <!--<script type="text/javascript" src="skin/js/jquery.bxslider.min.js"></script>-->
  <script type="text/javascript" src="skin/js/jquery.imagesloaded.min.js"></script>
  <!-- <script type="text/javascript" src="skin/js/retina-1.1.0.min.js"></script> -->
  <script type="text/javascript" src="skin/js/jquery.themepunch.tools.min.js"></script>
  <script type="text/javascript" src="skin/js/jquery.themepunch.revolution.min.js"></script>
  <script type="text/javascript" src="skin/js/base64.min.js"></script>
  <script type="text/javascript" src="skin/js/base.js"></script>
  <script type="text/javascript" src="skin/js/axios.min.js"></script>
  <script type="text/javascript" src="skin/js/script.js"></script>

  <!-- 移动端导航 -->
  <nav id="mmenu" class="noDis">
    <div class="mmDiv">

      <!-- 关闭 -->
      <div class="closefixed closemenu">
        <img src="./skin/images/close_pic.png" alt="" style="width: 20px; height: 20px;">
      </div>

      <!-- sign log -->
      <div class="MMhead">
        <ul class="users clearfix">
          <!-- 登录前 -->
          <li class="before before1">
            <a href="./sign-up.html" class="noblock logins">Sign Up</a>
          </li>

          <li class="before">
            <a href="javascript:;" class="noblock activeLogin">Log In</a>
          </li>

          <!-- 登录后 -->
          <!-- Account Details -->
          <li class="afters afters1">
            <a href="./account-details.html" class="item account">
              <img src="./skin/images/log-ren.png" class="pic" alt="">
            </a>
          </li>

          <!-- Favourites -->
          <li class="afters">
            <a href="./collection.html" class="item account">
              <img src="./skin/images/log-aixin.png" class="pic" alt="">
              <span class="num" id="faNum">0</span>
            </a>
          </li>

        </ul>

      </div>


      <!-- nav -->
      <ul class="mobnavbar">
        <li class="box">
          <a href="./index.html">Homes for Sale</a>
        </li>

        <li class="box">
          <a href="./aboutCharlotte.html">About Charlotte</a>
        </li>

        <li class="box">
          <a href="./contactUs.html">Contact Us</a>
        </li>

        <!-- <li class="box">
            <a href="./openHouses.html" class="m-menu1">Open Houses</a>
          </li> -->

        <!-- <li class="box">
            <a href="javascript:;" class="m-menu1">New Developments</a>
          </li>
  
          <li class="box">
            <a href="" class="m-menu1">Buildings</a>
          </li>
  
          <li class="box">
            <a href="" class="m-menu1">Find an Agent</a>
          </li>
          
          <li class="box">
            <a href="" class="m-menu1">Find an Agent</a>
          </li>
  
          <li class="box">
            <a href="javascript:;" class="m-menu1">Blog</a>
          </li> -->
      </ul>

      <!-- sign out 登录后出现 -->
      <div class="footout">
        <a class="" href="javascript:;">Sign Out</a>
      </div>

    </div>
  </nav>

  <link type="text/css" rel="stylesheet" href="skin/css/jquery.mmenu.all.css" />
  <script type="text/javascript" src="skin/js/jquery.mmenu.all.min.js"></script>
  <script type="text/javascript">
    $(function ($) {
      var baseUrl = localStorage.getItem('baseUrl');

      var currPages = 1;
      var sortvalue = '-listdate';
      // 列表
      var salesList = [];
      var showList = [];
      var totalPages = 0;
      var totalNum = 0;
      var firstData = []; // 获取的1项数据
      var ob = {}; // 所在页数据

      // 搜索
      var askKey = 'q'; // 搜索
      var askVal = ''; // 搜索词
      var fields = {};
      var cities = [];
      var counties = [];
      var neighborhoods = [];
      var ischange = true; // 找不到

      // filters中
      var propertyType = ''; // Property Type
      var priceFrom = ''; // Price from
      var priceTo = ''; // Price to
      var bedrooms = ''; // Bedrooms
      var bathrooms = ''; // Bathrooms
      var sqFrom = ''; // Sq. Feet from
      var sqTo = ''; // Sq. Feet to
      var yearFrom = ''; // Year built from
      var yearTo = ''; // Year built to
      var keywords = ''; // keywords

      setTimeout(() => {
        $('.datepicker').datepicker();
      }, 200)


      // 1.1.1 加载中
      function showLoad() {
        $('.load').show();
      }

      function hideLoad() {
        $('.load').hide();
      }

      function loading(m) {
        if (!m) {
          $('.load').show();
          setTimeout(() => {
            $('.load').hide();
          }, 1000)
        } else {
          $('.load').show();
          setTimeout(() => {
            $('.load').hide();
          }, m)
        }

      }

      // 1.1.2 获取智能搜索
      function getHelpList() {
        // (2) 请求--获取数据
        axios.post(baseUrl + '/mclient/srts/basicAttri', {}, {
            headers: {
              'token': localStorage.getItem('token')
            }
          })

          .then(function (res) {

            if (res.data.code == 0 && res.data.msg == "success") {
              console.log('-----获取提示列表成功-----', res);

              // (2.1) 存储
              fields = res.data.results.fields;
              localStorage.setItem('fields', res.data.results.fields);

              cities = res.data.results.fields.cities;
              counties = res.data.results.fields.counties;
              neighborhoods = res.data.results.fields.neighborhoods;


              var handCity = [];

              // (2.1.1) 处理 -- cities
              if (cities && cities.length) {
                cities.map((item, index, arr) => {
                  handCity.push({
                    value: (item + ' (city)'),
                    data: item
                  });
                })
              }

              // (2.1.2) 处理 -- counties
              if (counties && counties.length) {
                counties.map((item, index, arr) => {
                  handCity.push({
                    value: (item + ' (county)'),
                    data: item
                  });
                })
              }

              // (2.1.3) 处理 -- neighborhoods
              if (neighborhoods && neighborhoods.length) {
                neighborhoods.map((item, index, arr) => {
                  handCity.push({
                    value: (item + ' (neighbourhood)'),
                    data: item
                  });
                })
              }

              // 渲染
              var countries = handCity;

              $('#autocomplete1').autocomplete({
                lookup: countries,
                onSelect: function (res) {
                  // loading(2000);

                  var selectWords = res.value;
                  // askVal = res.value;

                  if (!String.prototype.contains) {
                    String.prototype.contains = function (arg) {
                      return !!~this.indexOf(arg);
                    };
                  }

                  // 去掉备注
                  if (selectWords.contains(' (city)')) {
                    askKey = 'cities';
                    selectWords = selectWords.replace(' (city)', '');

                  } else if (selectWords.contains(' (county)')) {
                    askKey = 'counties';
                    selectWords = selectWords.replace(' (county)', '');

                  } else if (selectWords.contains(' (neighbourhood)')) {
                    askKey = 'neighborhoods';
                    selectWords = selectWords.replace(' (neighbourhood)', '');
                  }


                  askVal = selectWords;

                  // 存储历史搜索词
                  localStorage.setItem('key', askKey);
                  localStorage.setItem('value', askVal);

                  propertyType = ''; // Property Type
                  priceFrom = ''; // Price from
                  priceTo = ''; // Price to
                  bedrooms = ''; // Bedrooms
                  bathrooms = ''; // Bathrooms
                  sqFrom = ''; // Sq. Feet from
                  sqTo = ''; // Sq. Feet to
                  yearFrom = ''; // Year built from
                  yearTo = ''; // Year built to
                  keywords = ''; // keywords

                  var params = {
                    [askKey]: htmlEncode(askVal),
                    'sort': sortvalue,
                    'limit': '10',
                    'offset': '0',
                    'type': propertyType,
                    'minprice': priceFrom,
                    'maxprice': priceTo,
                    'minbeds': bedrooms,
                    'maxbeds': '',
                    'minbaths': bathrooms,
                    'maxbaths': '',
                    'minarea': sqFrom,
                    'maxarea': sqTo,
                    'minyear': yearFrom,
                    'maxyear': yearTo,
                    // 'status': OnlyOpenHouses ? [' Active', 'Pending'] : [], // 只看空房子 ???
                    // 'exteriorFeatures': [keywords] // 外部特征 ??
                  };

                  console.log('-----获取列表传参-----', params);

                  getList(params, 1, 1);

                }
              });


              // 2.2 获取filters中的Property Type
              var proType = fields.type;
              var htmls = template('properTy', {
                proType: proType
              });
              $('.filter #filter-type1-select').html(htmls);


            } else {
              console.log('-----报错-----', res.data.msg);
            }

          })

          .catch(function (error) {
            console.log('-----请求提示失败-----', error);
          });

      };


      // 1.2 字符串进行 htmlEncode编码
      function htmlEncode(html) {
        //1.首先动态创建一个容器标签元素，如DIV
        var temp = document.createElement("div");
        //2.然后将要转换的字符串设置为这个元素的innerText(ie支持)或者textContent(火狐，google支持)
        (temp.textContent != undefined) ? (temp.textContent = html) : (temp.innerText = html);
        //3.最后返回这个元素的innerHTML，即得到经过HTML编码转换的字符串了
        var output = temp.innerHTML;
        temp = null;
        return output;
      }

      // 1.3 money
      function formatNum(str) {
        var str = typeof str == 'string' ? str : str + '';
        var newStr = "";
        var count = 0;
        // 当数字是整数
        if (str.indexOf(".") == -1) {
          for (var i = str.length - 1; i >= 0; i--) {
            if (count % 3 == 0 && count != 0) {
              newStr = str.charAt(i) + "," + newStr;
            } else {
              newStr = str.charAt(i) + newStr;
            }
            count++;
          }
          str = newStr; //自动补小数点后两位  + ".00"
          return str;
        }
        // 当数字带有小数
        else {
          for (var i = str.indexOf(".") - 1; i >= 0; i--) {
            if (count % 3 == 0 && count != 0) {
              newStr = str.charAt(i) + "," + newStr;
            } else {
              newStr = str.charAt(i) + newStr; //逐个字符相接起来
            }
            count++;
          }
          str = newStr + (str + "00").substr((str + "00").indexOf("."), 3);
          return str;
        }
      }

      // 1.4 获取参数
      function getUrlParam(name) {
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
        var r = window.location.search.substr(1).match(reg);
        if (r != null) return unescape(r[2]);
        return null;
      }

      // 1.5 获取参数
      // var askKey = getUrlParam('key');
      // var askVal = getUrlParam('value');

      askKey = localStorage.getItem('key');
      askVal = localStorage.getItem('value');

      // 1.6 请求
      function getList(params, ispage, szy, isChangeCurr) {

        // 3 top
        // setTimeout(() => {
        $('body,html').animate({
          scrollTop: 0
        }, 0)
        // }, 550)

          
        axios.post(baseUrl + '/mclient/srts/properties', params, {
            headers: {
              'token': localStorage.getItem('token')
            }
          })

          .then(function (res) {

            if (res.data.code == 0 && res.data.msg == "success") {
              console.log('-----获取不动产列表成功-----', res);

              // loading(2000);
              // 提示
              $('.houselist .randomMatching').hide();

              // 初始化顶部搜索框
              $('#pagesinthe .sr').val('');
              $('#pagesinthe #sale-searchbtn').removeClass('active');

              $('#listbox').html('');
              showList = [];

              var list = res.data.results;
              // console.log('-----列表为: -----', list)

              // 处理
              if (list && list.length) {
                list.map((item, index, arr) => {
                  if (item.listPrice) {
                    item.listPrice = formatNum(item.listPrice);
                  }
                })
              }

              salesList = list; // 存储
              firstData = [];
              if (list && list.length) {
                for (var i = 0; i < 10; i++) {
                  if (list[i]) {
                    showList.push(list[i]);
                  }

                  // 所在页
                  if (szy) {

                    if (i == 0) {
                      // 市
                      if (askKey == 'cities') {
                        ob.p1 = askVal; // 市
                        ob.p2 = list[i].address.country; // 国家
                        ob.p3 = 'cities'; // 搜索key
                        ob.p5 = ischange; // 是否找得到
                        ob.p8 = list[i].address.state;

                      } else if (askKey == 'counties') {
                        // 县
                        ob.p1 = list[i].address.city; // 城市
                        ob.p2 = askVal; // 县
                        ob.p3 = 'cities'; // 搜索key
                        ob.p5 = ischange; // 是否找得到
                        ob.p8 = list[i].address.state;

                      } else if (askKey == 'neighborhoods') {
                        // 街区
                        ob.p1 = list[i].geo.county; // 县
                        ob.p2 = askVal; // 街区
                        ob.p3 = 'counties'; // 搜索key
                        ob.p5 = ischange; // 是否找得到
                        ob.p8 = list[i].address.state;

                      } else if (askKey == 'q') {
                        // 随机匹配列表
                        ob.p1 = list[i].geo.county; // 县
                        ob.p2 = ''; // 街区
                        ob.p3 = 'counties'; // 搜索key
                        ob.p5 = ischange; // 是否找得到
                        ob.p8 = list[i].address.state;
                      }

                      firstData.push(ob);
                    }
                  } else {
                    firstData = [];
                    firstData.push(ob);
                  }

                }

                // showList = list;
              }


              onPagesPc(); // 所在页 pc
              onPagesMobile(); // 所在页 mobile

              // 随机展示
              if(askKey == 'q') {
                $('.houselist .randomMatching').show();
              } else {
                $('.houselist .randomMatching').hide();
              }

              // 渲染
              var html = template('thelist', {
                list: showList
              });
              $('#listbox').html(html);

              // 无数据
              if (!list.length) {
                $('#noData1').show();
                $('#innerpage-wrap #thesort').hide();
              } else {
                $('#noData1').hide();
                $('#innerpage-wrap #thesort').show();
              }

              // 总页数 -- 返回
              var pagelength = Math.ceil(res.data.resultsNum / 10);
              totalPages = +pagelength; // 总页数
              totalNum = res.data.resultsNum; // 总数量

              getMls(); // mls

              // 分页
              if (ispage) {
                var pLists = [];
                for (var i = 0; i < pagelength; i++) {
                  pLists.push(i + 1);
                }

                var html6 = template('pagelist', {
                  pageList: pLists
                });
                $('#pageing').html(html6);

              }

              // 当前页选中
              if (isChangeCurr) {
                $('#pageing .tpage').each(function (index, ele) {
                  $(this).removeClass('active');
                  if ($(this).find('a').text() == currPages) {
                    $(this).addClass('active');
                  }
                })
              }


            } else {
              console.log('-----报错-----', res.data.msg);
            }

          })

          .catch(function (error) {
            console.log('-----获取不动产列表失败-----', error);
          });

      }


      // 从详情页返回
      var isFromDetail = sessionStorage.getItem('fromList');
      if (isFromDetail) {
        sessionStorage.removeItem('fromList');

        sortvalue = sessionStorage.getItem('sortvalue', sortvalue);
        propertyType = sessionStorage.getItem('type', propertyType);
        priceFrom = sessionStorage.getItem('minprice', priceFrom);
        priceTo = sessionStorage.getItem('maxprice', priceTo);
        bedrooms = sessionStorage.getItem('minbeds', bedrooms);
        bathrooms = sessionStorage.getItem('minbaths', bathrooms);
        sqFrom = sessionStorage.getItem('minarea', sqFrom);
        sqTo = sessionStorage.getItem('maxarea', sqTo);
        yearFrom = sessionStorage.getItem('minyear', yearFrom);
        yearTo = sessionStorage.getItem('maxyear', yearTo);

        var dqy = sessionStorage.getItem('currentPage');
        currPages = +dqy;

        console.log('-----从详情页回来-----', currPages);

        // sort的选中
        $('#sortBoxes .sort-item').removeClass('active');
        $('#sortBoxes .sort-item').find('.sortArr').removeClass('link');

        if (sortvalue == '-listdate') {
          // Latest
          $('#sortBoxes #sLatest').addClass('active');
          $('#sortBoxes #sLatest').find('.sortArr').addClass('link');

        } else if (sortvalue == 'listdate') {
          // Latest
          $('#sortBoxes #sLatest').addClass('active');
          $('#sortBoxes #sLatest').find('.sortArr').removeClass('link');

        } else if (sortvalue == '-listprice') {
          // Price
          $('#sortBoxes #sPrice').addClass('active');
          $('#sortBoxes #sPrice').find('.sortArr').addClass('link');

        } else if (sortvalue == 'listprice') {
          // Price
          $('#sortBoxes #sPrice').addClass('active');
          $('#sortBoxes #sPrice').find('.sortArr').removeClass('link');

        } else if (sortvalue == '-beds') {
          // Price
          $('#sortBoxes #sBd').addClass('active');
          $('#sortBoxes #sBd').find('.sortArr').addClass('link');

        } else if (sortvalue == 'beds') {
          // Price
          $('#sortBoxes #sBd').addClass('active');
          $('#sortBoxes #sBd').find('.sortArr').removeClass('link');

        } else if (sortvalue == '-baths') {
          // Price
          $('#sortBoxes #sBa').addClass('active');
          $('#sortBoxes #sBa').find('.sortArr').addClass('link');

        } else if (sortvalue == 'baths') {
          // Price
          $('#sortBoxes #sBa').addClass('active');
          $('#sortBoxes #sBa').find('.sortArr').removeClass('link');

        } else {}

        mobileSort();


        var params35 = {
          [askKey]: htmlEncode(askVal),
          'sort': sortvalue,
          'limit': '10',
          'offset': (currPages - 1) * 10 + '',
          'type': propertyType,
          'minprice': priceFrom,
          'maxprice': priceTo,
          'minbeds': bedrooms,
          'maxbeds': '',
          'minbaths': bathrooms,
          'maxbaths': '',
          'minarea': sqFrom,
          'maxarea': sqTo,
          'minyear': yearFrom,
          'maxyear': yearTo,
          // 'status': OnlyOpenHouses ? [' Active', 'Pending'] : [], // 只看空房子 ???
          // 'exteriorFeatures': [keywords] // 外部特征 ??
        };

        console.log('------请求列表传参-----', params35);

        getList(params35, 1, 1, 1);


      } else {

        // 初始化: 列表
        if (askVal) {
          currPages = 1;

          var params1 = {
            [askKey]: htmlEncode(askVal),
            'sort': sortvalue,
            'limit': '10',
            'offset': (currPages - 1) * 10 + '',
            'type': propertyType,
            'minprice': priceFrom,
            'maxprice': priceTo,
            'minbeds': bedrooms,
            'maxbeds': '',
            'minbaths': bathrooms,
            'maxbaths': '',
            'minarea': sqFrom,
            'maxarea': sqTo,
            'minyear': yearFrom,
            'maxyear': yearTo,
            // 'status': OnlyOpenHouses ? [' Active', 'Pending'] : [], // 只看空房子 ???
            // 'exteriorFeatures': [keywords] // 外部特征 ??
          };

          console.log('------请求列表传参-----', params1);

          getList(params1, 1, 1);

        } else {

          // 避免: 清缓存
          currPages = 1;
          askKey = 'q';
          localStorage.setItem('key', 'q');
          localStorage.setItem('value', 'ask');

          $('.houselist .randomMatching').show();

          var params89 = {
            'q': htmlEncode('ask'),
            'sort': sortvalue,
            'limit': '10',
            'offset': (currPages - 1) * 10 + '',
            'type': propertyType,
            'minprice': priceFrom,
            'maxprice': priceTo,
            'minbeds': bedrooms,
            'maxbeds': '',
            'minbaths': bathrooms,
            'maxbaths': '',
            'minarea': sqFrom,
            'maxarea': sqTo,
            'minyear': yearFrom,
            'maxyear': yearTo,
            // 'status': OnlyOpenHouses ? [' Active', 'Pending'] : [], // 只看空房子 ???
            // 'exteriorFeatures': [keywords] // 外部特征 ??
          };

          console.log('------请求列表传参-----', params89);

          getList(params89, 1, 1);

        }

      }


      // 获取智能提示
      getHelpList();


      // 1.6 获取MLS
      function getMls() {
        var firstData1 = firstData;
        var salesList1 = salesList;

        firstData1[0].total = totalNum; // 总数

        var html = template('mls', {
          firstData1: firstData1
        });
        $('#innerpage-wrap #mlsbox').html(html);
      }
    
      // 15 获取右侧随机列表
      ;(function getRandomistings () {
        // 请求
        axios.post(baseUrl + '/mclient/srts/list4Radm', {}, {
            headers: {
              'token': localStorage.getItem('token')
            }
          })

          .then(function (res) {

            if (res.data.code == 0 && res.data.msg == "success") {
              console.log('-----获取 随机列表 成功-----', res);

              var getList = res.data.results;
              randList = [];
              if (getList && getList.length) {
                getList.map((item, index, arr) => {
                  if (index >= 0 && index <= 5) {
                    randList.push(item);
                  }
                })
              }

              // 处理
              if (randList && randList.length) {
                randList.map((item, index, arr) => {
                  if (item.listPrice) {
                    item.listPrice = formatNum(item.listPrice);
                  }
                })
              }


              var html3 = template('randoms', {rlist: randList});
              $('.houselist .saleMain #sjrandlist').html(html3);
              
              var ranLists = [
                {
                  'title': res.data.listTag,
                  'num': res.data.results.length
                }
              ];
              var html4 = template('randomTitle', {titleList: ranLists});
              $('.houselist .saleMain #sjTit').html(html4);

              $("#owl-latestEx").owlCarousel({
                items: 4,
                lazyLoad: false,
                autoPlay: false,
                navigation: false,
                navigationText: false,
                pagination: true,
              });



            } else {
              console.log('-----报错-----', res.data.msg);
            }

          })

          .catch(function (error) {
            console.log('-----获取 随机列表 失败-----', error);
          });

      })();
      
      // 16 点击每项随机列表
      $('.houselist #listright #sjrandlist').on('click', '.item', function (e) {

        var id = $(this).data().id;
        // 跳转详情页
        window.location.href = `./saleDetail.html?id=${id}`;

      });


      // 2 点击每项
      $('#listbox').on('click', '.list-item', function (e) {

        sessionStorage.setItem('currentPage', currPages);
        sessionStorage.setItem('sortvalue', sortvalue);
        sessionStorage.setItem('type', propertyType);
        sessionStorage.setItem('minprice', priceFrom);
        sessionStorage.setItem('maxprice', priceTo);
        sessionStorage.setItem('minbeds', bedrooms);
        sessionStorage.setItem('minbaths', bathrooms);
        sessionStorage.setItem('minarea', sqFrom);
        sessionStorage.setItem('maxarea', sqTo);
        sessionStorage.setItem('minyear', yearFrom);
        sessionStorage.setItem('maxyear', yearTo);


        var id = $(this).data().id;
        // 跳转详情页
        // window.open(`./saleDetail.html?id=${id}`);
        window.location.href = `./saleDetail.html?id=${id}`;

      })

      // 3 筛选
      // 3.1 tab
      $('#sortBoxes').on('click', '.sort-item', function () {
        $(this).addClass('active').siblings('.sort-item').removeClass('active');
        $(this).siblings('.sort-item').find('.sortArr').removeClass('link');
        $(this).find('.sortArr').toggleClass('link');

        mobileSort();

      });

      // 3.2 mobile
      function mobileSort() {
        var sLatest1 = $('#sortBoxes #sLatest').hasClass('active');
        if (sLatest1) {
          $('#mobileSort .item').removeClass('active');
          $('#mobileSort .item1').addClass('active');
        }

        var sPrice1 = $('#sortBoxes #sPrice').hasClass('active');
        if (sPrice1) {
          $('#mobileSort .item').removeClass('active');
          $('#mobileSort .item2').addClass('active');
        }

        var sBd1 = $('#sortBoxes #sBd').hasClass('active');
        if (sBd1) {
          $('#mobileSort .item').removeClass('active');
          $('#mobileSort .item3').addClass('active');
        }

        var sBa1 = $('#sortBoxes #sBa').hasClass('active');
        if (sBa1) {
          $('#mobileSort .item').removeClass('active');
          $('#mobileSort .item5').addClass('active');
        }
      }

      // 3.2.1 mobile Latest
      $('#mobileSort').on('click', '#mLatest', function () {
        $('#sortBoxes #sLatest').click();
        $('#mobileSort').hide();
      })

      // 3.2.2 mobile Price
      $('#mobileSort').on('click', '#mPrice', function () {
        $('#sortBoxes #sPrice').click();
        $('#mobileSort').hide();
      })

      // 3.2.3 mobile Bd
      $('#mobileSort').on('click', '#mBd', function () {
        $('#sortBoxes #sBd').click();
        $('#mobileSort').hide();
      })

      // 3.2.4 mobile Ba
      $('#mobileSort').on('click', '#mBa', function () {
        $('#sortBoxes #sBa').click();
        $('#mobileSort').hide();
      })


      // 3.3 pc
      // 3.3.1 最新的 Latest
      $('#sortBoxes').on('click', '#sLatest', function () {
        var hlatest = $(this).find('.sortArr').hasClass('link'); // true 降序
        sortvalue = hlatest ? '-listdate' : 'listdate';

        // loading(2000);

        var params7 = {
          [askKey]: htmlEncode(askVal), // 搜索关键字
          'sort': sortvalue, // +: 升序  -: 降序
          'limit': '10',
          'offset': (currPages - 1) * 10 + '',
          'type': propertyType,
          'minprice': priceFrom,
          'maxprice': priceTo,
          'minbeds': bedrooms,
          'maxbeds': '',
          'minbaths': bathrooms,
          'maxbaths': '',
          'minarea': sqFrom,
          'maxarea': sqTo,
          'minyear': yearFrom,
          'maxyear': yearTo,
          // 'status': OnlyOpenHouses ? [' Active', 'Pending'] : [], // 只看空房子 ???
          // 'exteriorFeatures': [keywords] // 外部特征 ??
        };

        console.log('-----请求列表传参-----', params7);
        getList(params7);

      })

      // 3.3.2 价格 Price
      $('#sortBoxes').on('click', '#sPrice', function () {
        var hprice = $(this).find('.sortArr').hasClass('link'); // true 降序
        sortvalue = hprice ? '-listprice' : 'listprice';

        // loading(2000);

        var params2 = {
          [askKey]: htmlEncode(askVal), // 搜索关键字
          'sort': sortvalue, // +: 升序 -: 降序
          'limit': '10',
          'offset': (currPages - 1) * 10 + '',
          'type': propertyType,
          'minprice': priceFrom,
          'maxprice': priceTo,
          'minbeds': bedrooms,
          'maxbeds': '',
          'minbaths': bathrooms,
          'maxbaths': '',
          'minarea': sqFrom,
          'maxarea': sqTo,
          'minyear': yearFrom,
          'maxyear': yearTo,
          // 'status': OnlyOpenHouses ? [' Active', 'Pending'] : [], // 只看空房子 ???
          // 'exteriorFeatures': [keywords] // 外部特征 ??
        };
        console.log('-----请求列表传参-----', params2);

        getList(params2);

      })

      // 3.3.3 Bd
      $('#sortBoxes').on('click', '#sBd', function () {
        var hbd = $(this).find('.sortArr').hasClass('link'); // true 降序
        sortvalue = hbd ? '-beds' : 'beds';

        // loading(2000);

        var params9 = {
          [askKey]: htmlEncode(askVal), // 搜索关键字
          'sort': sortvalue, // +: 升序 -: 降序
          'limit': '10',
          'offset': (currPages - 1) * 10 + '',
          'type': propertyType,
          'minprice': priceFrom,
          'maxprice': priceTo,
          'minbeds': bedrooms,
          'maxbeds': '',
          'minbaths': bathrooms,
          'maxbaths': '',
          'minarea': sqFrom,
          'maxarea': sqTo,
          'minyear': yearFrom,
          'maxyear': yearTo,
          // 'status': OnlyOpenHouses ? [' Active', 'Pending'] : [], // 只看空房子 ???
          // 'exteriorFeatures': [keywords] // 外部特征 ??
        };
        console.log('-----请求列表传参-----', params9);

        getList(params9);

      })

      // 3.3.4 Ba
      $('#sortBoxes').on('click', '#sBa', function () {
        var hba = $(this).find('.sortArr').hasClass('link'); // true 降序
        sortvalue = hba ? '-baths' : 'baths';

        // loading(2000);

        var params10 = {
          [askKey]: htmlEncode(askVal), // 搜索关键字
          'sort': sortvalue, // +: 升序 -: 降序
          'limit': '10',
          'offset': (currPages - 1) * 10 + '',
          'type': propertyType,
          'minprice': priceFrom,
          'maxprice': priceTo,
          'minbeds': bedrooms,
          'maxbeds': '',
          'minbaths': bathrooms,
          'maxbaths': '',
          'minarea': sqFrom,
          'maxarea': sqTo,
          'minyear': yearFrom,
          'maxyear': yearTo,
          // 'status': OnlyOpenHouses ? [' Active', 'Pending'] : [], // 只看空房子 ???
          // 'exteriorFeatures': [keywords] // 外部特征 ??
        };
        console.log('-----请求列表传参-----', params10);

        getList(params10);

      })


      // 4 点击--filter
      // 4.1 显示
      $('.sort').on('click', '#filter', function () {
        $('.filter').animate({
          'left': '0'
        });
        $('.filter .offcanvas-backdrop').show();
      })

      // 4.2 关闭
      $('.filter').on('click', '.offcanvas-backdrop', function () {
        $('.filter').animate({
          'left': '-326px'
        }, 200);
        $('.filter .offcanvas-backdrop').hide();
      })

      // 4.3 点击--filter弹出框中的搜索
      $('.filter #filter-btn').on('click', '#filter-submit', function () {
        // 存储
        propertyType = $('#filter-type1 #filter-type1-select').val(); // Property Type
        priceFrom = $('#filter-type2 #filter-type2-priceFrom').val(); // Price from
        priceTo = $('#filter-type3 #filter-type3-priceTo').val(); // Price to
        bedrooms = $('#filter-type4 #filter-type4-bedrooms').val(); // Bedrooms
        bathrooms = $('#filter-type5 #filter-type5-bathrooms').val(); // Bathrooms
        sqFrom = $('#filter-type6 #filter-type6-sqFrom').val(); // Sq. Feet from
        sqTo = $('#filter-type7 #filter-type7-sqTo').val(); // Sq. Feet to
        yearFrom = $('#filter-type8 #filter-type8-yearFrom').val(); // Year built from
        yearTo = $('#filter-type9 #filter-type9-yearTo').val(); // Year built to
        keywords = $('#filter-type10 #theinput').val(); // keywords

        // 是否只看空房子 -- true false
        var OnlyOpenHouses = $('#filter-btn .checkboxtoggle-button').hasClass('isactive');

        var params6 = {
          [askKey]: htmlEncode(askVal), // 搜索关键字
          'sort': sortvalue, //排序
          'limit': '10',
          'offset': (currPages - 1) * 10 + '',
          'type': propertyType,
          'minprice': priceFrom,
          'maxprice': priceTo,
          'minbeds': bedrooms,
          'maxbeds': '',
          'minbaths': bathrooms,
          'maxbaths': '',
          'minarea': sqFrom,
          'maxarea': sqTo,
          'minyear': yearFrom,
          'maxyear': yearTo,
          'status': OnlyOpenHouses ? [' Active', 'Pending'] : [], // 只看空房子 ???
          // 'exteriorFeatures': [keywords] // 外部特征 ??
        };
        console.log('-----获取列表传参-----', params6);

        // loading(2000);
        $('.filter .offcanvas-backdrop').click();
        getList(params6, 1);

        // 初始化
        // setTimeout(()=>{
        //   $('#filter-type1 #filter-type1-select').val(''); // Property Type
        //   $('#filter-type2 #filter-type2-priceFrom').val(''); // Price from
        //   $('#filter-type3 #filter-type3-priceTo').val(''); // Price to
        //   $('#filter-type4 #filter-type4-bedrooms').val(''); // Bedrooms
        //   $('#filter-type5 #filter-type5-bathrooms').val(''); // Bathrooms
        //   $('#filter-type6 #filter-type6-sqFrom').val(''); // Sq. Feet from
        //   $('#filter-type7 #filter-type7-sqTo').val(''); // Sq. Feet to
        //   $('#filter-type8 #filter-type8-yearFrom').val(''); // Year built from
        //   $('#filter-type9 #filter-type9-yearTo').val(''); // Year built to
        //   $('#filter-type10 #theinput').val(''); // keywords
        //   $('#filter-btn .checkboxtoggle-button').removeClass('isactive');
        // },600)  

      })

      // 4.4 点击--filter弹出层中的开关
      $('#filter-btn').on('click', '.switches', function () {
        $(this).find('.checkboxtoggle-button').toggleClass('isactive');
      })


      // 5 点击--移动端sort
      $('.sort').on('click', '.msort', function () {
        $('.sort .selectBx').toggle();
      })

      // 6.1.1 所在页--位置 pc
      function onPagesPc() {

        var html5 = template('pagePc', {
          szpage: firstData
        });
        $('#pagesinthe #l-pc').html(html5);

      };
      // 6.1.2 所在页--位置 mobile
      function onPagesMobile() {

        var html6 = template('pageMobile', {
          szpage: firstData
        });
        $('#pagesinthe #l-mobile').html(html6);

      }

      // 6.2 点击--所在页--第2项
      $('#pagesinthe').on('click', '.thesear', function (e) {
        var ke = e.currentTarget.dataset.ke;
        var val = $(this).text();

        // 存储
        askKey = ke;
        askVal = val;

        localStorage.setItem('key', askKey);
        localStorage.setItem('value', askVal);

        // loading(2000);
        $('#listbox').html('');
        var params3 = {
          [ke]: htmlEncode(val),
          'sort': '-listdate',
          'limit': '10',
          'offset': '0',
          'type': propertyType,
          'minprice': priceFrom,
          'maxprice': priceTo,
          'minbeds': bedrooms,
          'maxbeds': '',
          'minbaths': bathrooms,
          'maxbaths': '',
          'minarea': sqFrom,
          'maxarea': sqTo,
          'minyear': yearFrom,
          'maxyear': yearTo,
        };

        console.log('------请求列表传参-----', params3);
        getList(params3, 1, 1);

      })

      // 7 分页
      // 渲染
      function exhibition(current) {

        // 2 列表
        var list = salesList; // 存储
        showList = [];
        if (list && list.length) {
          for (var i = (10 * current - 10); i < (10 * current); i++) {
            if (list[i]) {
              showList.push(list[i]);
            }
          }
        }

        // loading(2000);

        var html = template('thelist', {
          list: showList
        });
        $('#listbox').html(html);

        // 3 top
        // setTimeout(() => {
        $('body,html').animate({
          scrollTop: 0
        }, 0)
        // }, 550)

      }

      // 7.1 当前所在页
      $('#pageing').on('click', '.tpage', function () {
        var tx = $(this).find('a').text();
        if (tx != '...') {
          // active
          $(this).addClass('active').siblings('.tpage').removeClass('active');
          currPages = +tx;

          // // 显示
          // exhibition(currPages);

          var params11 = {
            [askKey]: htmlEncode(askVal),
            'sort': sortvalue,
            'limit': '10',
            'offset': (currPages - 1) * 10 + '',
            'type': propertyType,
            'minprice': priceFrom,
            'maxprice': priceTo,
            'minbeds': bedrooms,
            'maxbeds': '',
            'minbaths': bathrooms,
            'maxbaths': '',
            'minarea': sqFrom,
            'maxarea': sqTo,
            'minyear': yearFrom,
            'maxyear': yearTo,
            // 'status': OnlyOpenHouses ? [' Active', 'Pending'] : [], // 只看空房子 ???
            // 'exteriorFeatures': [keywords] // 外部特征 ??
          };
          console.log('------请求列表传参-----', params11);

          getList(params11);

        }
      })

      // 7.2 点击--上一页
      $('#pageing').on('click', '.larr', function () {
        // 1 数字
        var current = +currPages;
        var reduce = 1;
        if (current <= 1) {
          reduce = 1;
          return;
        } else {
          reduce = current - 1;
        }

        currPages = reduce;

        // 1.1 当前显示数字
        $('#pageing .tpage').each(function (index, ele) {
          $(this).removeClass('active');

          if ($(this).find('a').text() == reduce) {
            $(this).addClass('active');
          }

        })

        // 显示
        var params = {
          [askKey]: htmlEncode(askVal),
          'sort': sortvalue,
          'limit': '10',
          'offset': (currPages - 1) * 10 + '',
          'type': propertyType,
          'minprice': priceFrom,
          'maxprice': priceTo,
          'minbeds': bedrooms,
          'maxbeds': '',
          'minbaths': bathrooms,
          'maxbaths': '',
          'minarea': sqFrom,
          'maxarea': sqTo,
          'minyear': yearFrom,
          'maxyear': yearTo,
          // 'status': OnlyOpenHouses ? [' Active', 'Pending'] : [], // 只看空房子 ???
          // 'exteriorFeatures': [keywords] // 外部特征 ??
        };
        console.log('------请求列表传参-----', params);

        getList(params);
        // exhibition(reduce);

      })

      // 7.3 点击 -- 下一页
      $('#pageing').on('click', '.rarr', function () {
        // 1 数字
        var current = +currPages;
        var list = salesList;
        var add = 1;
        if (current >= totalPages) {
          add = totalPages;
          return;

        } else {
          add = current + 1;
        }

        currPages = add;

        // 1.1 当前显示数字
        $('#pageing .tpage').each(function (index, ele) {
          $(this).removeClass('active');
          if ($(this).find('a').text() == add) {
            $(this).addClass('active');
          }
        })

        // 1.2 显示
        var params = {
          [askKey]: htmlEncode(askVal),
          'sort': sortvalue,
          'limit': '10',
          'offset': (currPages - 1) * 10 + '',
          'type': propertyType,
          'minprice': priceFrom,
          'maxprice': priceTo,
          'minbeds': bedrooms,
          'maxbeds': '',
          'minbaths': bathrooms,
          'maxbaths': '',
          'minarea': sqFrom,
          'maxarea': sqTo,
          'minyear': yearFrom,
          'maxyear': yearTo,
          // 'status': OnlyOpenHouses ? [' Active', 'Pending'] : [], // 只看空房子 ???
          // 'exteriorFeatures': [keywords] // 外部特征 ??
        };
        console.log('------请求列表传参-----', params);

        getList(params);

        // exhibition(add);

      })

      // 7.4 点击 -- 首页
      $('#pageing').on('click', '.homePage', function () {
        // 1 数字
        var current = 1;
        currPages = 1;

        // 1.1 当前显示数字
        $('#pageing .tpage').each(function (index, ele) {
          $(this).removeClass('active');

          if ($(this).find('a').text() == current) {
            $(this).addClass('active');
          }

        })

        // 显示
        var params = {
          [askKey]: htmlEncode(askVal),
          'sort': sortvalue,
          'limit': '10',
          'offset': '0',
          'type': propertyType,
          'minprice': priceFrom,
          'maxprice': priceTo,
          'minbeds': bedrooms,
          'maxbeds': '',
          'minbaths': bathrooms,
          'maxbaths': '',
          'minarea': sqFrom,
          'maxarea': sqTo,
          'minyear': yearFrom,
          'maxyear': yearTo,
          // 'status': OnlyOpenHouses ? [' Active', 'Pending'] : [], // 只看空房子 ???
          // 'exteriorFeatures': [keywords] // 外部特征 ??
        };
        console.log('------请求列表传参-----', params);

        getList(params);

        // exhibition(current);

      })

      // 7.5 点击 -- 末页
      $('#pageing').on('click', '.lastPage', function () {

        // 1 数字
        var current = +totalPages;
        currPages = +totalPages;

        // 1.1 当前显示数字
        $('#pageing .tpage').each(function (index, ele) {
          $(this).removeClass('active');

          if ($(this).find('a').text() == current) {
            $(this).addClass('active');
          }

        })

        // 显示
        var params = {
          [askKey]: htmlEncode(askVal),
          'sort': sortvalue,
          'limit': '10',
          'offset': (currPages - 1) * 10 + '',
          'type': propertyType,
          'minprice': priceFrom,
          'maxprice': priceTo,
          'minbeds': bedrooms,
          'maxbeds': '',
          'minbaths': bathrooms,
          'maxbaths': '',
          'minarea': sqFrom,
          'maxarea': sqTo,
          'minyear': yearFrom,
          'maxyear': yearTo,
          // 'status': OnlyOpenHouses ? [' Active', 'Pending'] : [], // 只看空房子 ???
          // 'exteriorFeatures': [keywords] // 外部特征 ??
        };
        console.log('------请求列表传参-----', params);

        getList(params);
        // exhibition(current);

      })


      // 8 点击收藏
      $('#listbox').on('click', '.mask', function (e) {
        e.stopPropagation();

        // 前提--登录
        if (localStorage.getItem('token')) {

          var item1 = $(this).data().item;

          // 请求
          var params5 = {
            'mlsId': item1.mlsId + '',
            'propertiesData': item1,
            'actionDo': item1.isCollect == 1 ? -1 : 1 // -1 取消
          };
          console.log('----- 收藏传参 -----', params5);

          axios.post(baseUrl + '/mclient/member/collectProperties', params5, {
              headers: {
                'token': localStorage.getItem('token')
              }
            })

            .then(function (res) {

              if (res.data.code == 0 && res.data.msg == "success") {
                console.log('-----收藏成功-----', res);

                // api中无字段判断
                // 1.1 刷新列表
                var showList1 = showList;
                showList1.map((item, index, arr) => {
                  if (item1.mlsId == item.mlsId) {
                    item.isCollect = (item.isCollect == 1 ? -1 : 1);
                  }
                })

                showList = showList1;

                // 1.2 渲染
                var html = template('thelist', {
                  list: showList1
                });
                $('#listbox').html(html);

                // 2 获取收藏数
                getLikeList();

              } else {
                console.log('-----收藏不成功-----', res);
              }

            })

            .catch(function (res) {
              console.log('-----请求收藏接口失败-----', res);
            });

        } else {

          // 未登录--提示
          $('.signin').show();
          $('.signin .content').slideDown();
        }


      })

      // 关闭      
      $('.signin').on('click', '.closebtn', function () {

        $('.signin .content').slideUp();

        setTimeout(() => {
          $('.signin').hide();
        }, 100)


      })

      // 9 获取收藏数
      var likeListResult = [];

      function getLikeList() {

        axios.post(baseUrl + '/mclient/member/collectList', {}, {
            headers: {
              'token': localStorage.getItem('token')
            }
          })

          .then(function (res) {

            if (res.data.code == 0 && res.data.msg == "success") {
              console.log('-----获取收藏列表成功-----', res);
              likeListResult = res.data.results;

              if (likeListResult) {
                $('.aboutUser #userFavourite .favNum').text(likeListResult.length);
                $('.users .afters #faNum').text(likeListResult.length); //移动端
              }

            } else {
              console.log('-----获取收藏列表不成功-----', res);
            }

          })

          .catch(function (res) {
            console.log('-----请求收藏列表接口失败-----', res);
          });

      };

      // 10 点击--顶部搜索框
      $('#pagesinthe').on('click', '#sale-searchbtn', function () {

        var svalue = $('#pagesinthe .sr').val();

        if (!svalue) {
          return;
        }

        if (cities && cities.length) {
          cities.map((item, index, arr) => {
            if (item == svalue) {
              askKey = 'cities';
              ischange = false;
            }
          })
        }

        if (counties && counties.length) {
          counties.map((item, index, arr) => {
            if (item == svalue) {
              askKey = 'counties';
              ischange = false;
            }
          })
        }

        if (neighborhoods && neighborhoods.length) {
          neighborhoods.map((item, index, arr) => {
            if (item == svalue) {
              askKey = 'neighborhoods';
              ischange = false;
            }
          })
        }

        // 选中样式
        $(this).addClass('active');

        // 随机显示一项
        if (ischange) {
          askKey = 'q';

          // if(neighborhoods && neighborhoods.length) {
          //   var max = 0;
          //   var min = neighborhoods.length - 1;
          //   var sjnum = Math.floor( Math.random() * (max - min + 1) + min );
          //   console.log('-----随机数-----', neighborhoods[sjnum]);
          //   svalue = neighborhoods[sjnum];
          // }

        }

        askVal = svalue;

        // 存储历史搜索词
        localStorage.setItem('key', askKey);
        localStorage.setItem('value', svalue);

        propertyType = ''; // Property Type
        priceFrom = ''; // Price from
        priceTo = ''; // Price to
        bedrooms = ''; // Bedrooms
        bathrooms = ''; // Bathrooms
        sqFrom = ''; // Sq. Feet from
        sqTo = ''; // Sq. Feet to
        yearFrom = ''; // Year built from
        yearTo = ''; // Year built to
        keywords = ''; // keywords

        // 加载中
        // loading(2000);
        params = {
          [askKey]: htmlEncode(svalue),
          'sort': sortvalue,
          'limit': '10',
          'offset': '0',
          'type': propertyType,
          'minprice': priceFrom,
          'maxprice': priceTo,
          'minbeds': bedrooms,
          'maxbeds': '',
          'minbaths': bathrooms,
          'maxbaths': '',
          'minarea': sqFrom,
          'maxarea': sqTo,
          'minyear': yearFrom,
          'maxyear': yearTo,
          // 'status': OnlyOpenHouses ? [' Active', 'Pending'] : [], // 只看空房子 ???
          // 'exteriorFeatures': [keywords] // 外部特征 ??
        };
        console.log('-----获取列表传参-----', params);
        getList(params, 1, 1);

      })
      $("#pagesinthe").on('keyup', '.sr', function (e) {
        if (e.which === 13) {
          $("#pagesinthe #sale-searchbtn").click();
        }
      });

      // sr-focus blur 样式修改
      $("#pagesinthe").on('focus', '.sr', function () {
        $(this).css('border', '2px solid #F3C67B');
      })
      $("#pagesinthe").on('blur', '.sr', function () {
        $(this).css('border', 'none');
      })

      // 11 点击 -- mls的 Filter by Neighbourhood
      $('#mlsbox').on('click', '#filterByN', function () {
        $('#mlsbox #allData').slideToggle();
        $('#mlsbox .rgh .link_indicator').toggleClass('link');
      })

      // 12 点击 -- see Map
      $('.houselist #thesort').on('click', '#seeListMap', function () {
        window.location.href = `./property-byMap.html?y=${askKey}&u=${askVal}`;
      })

      // 13 点击--发送代理咨询
      $('#listright').on('click', '#sendConsults #subSend', function () {
        // 日期
        var sdate = $('#sendConsults #f-date').val();
        // 姓名
        var sname = $('#sendConsults #f-name').val();
        // 邮件
        var semail = $('#sendConsults #f-email').val();
        // 电话
        var sphone = $('#sendConsults #f-phone').val();


        // if (!sdate) {
        //   $('#sendConsults #selectDate .ts').show();
        //   return;
          
        // } else {
        //   // 处理时间
        //   var s = sdate;
        //   var y = s.substr(s.lastIndexOf('/') + 1, 4);
        //   var m = s.substr(0, s.indexOf('/'));
        //   var d = s.substr(s.indexOf('/') + 1, 2);
        //   sdate = y + '-' + m + '-' + d;
        // }

        if (!sname) {
          $('#sendConsults #myNameS .ts').show();
          return;
        }

        if (!semail) {
          $('#sendConsults #myEmailS .ts').text('cannot be blank');
          $('#sendConsults #myEmailS .ts').show();
          return;
        } else {

          var reg = /^[A-Za-z0-9\u4e00-\u9fa5]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/;
          if (!reg.test(semail)) {
            $('#sendConsults #myEmailS .ts').text('Please enter the correct email.');
            $('#sendConsults #myEmailS .ts').show();
            return;
          }

        }

        if (!sphone) {
          $('#sendConsults #myPhoneS .ts').show();
          return;
        }


        // 请求
        var params3 = {
          'preferredDate': sdate,
          'custName': sname,
          'email': semail,
          'phone': sphone,
        }

        axios.post(baseUrl + '/mclient/member/consultation', params3, {
            headers: {
              'token': localStorage.getItem('token')
            }
          })

          .then(function (res) {

            // 1 登录成功
            if (res.data.code == 0 && res.data.msg == 'success') {

              console.log('-----发送咨询成功-----', res);

              // loading(1000);

              // setTimeout(() => {

                // 提示
                $('.commonTips .txt').text('The submission of the view request was successful.');
                $('.commonTips').show();

                setTimeout(() => {
                  $('.commonTips').hide();
                }, 7000)
              // }, 1000)


            } else {

              console.log('-----发送咨询失败-----', res);

              // loading(1000);

              // setTimeout(() => {

                $('.commonTips .txt').text('Failed to submit a view request.');
                $('.commonTips').show();

                setTimeout(() => {
                  $('.commonTips').hide();
                }, 7000)
              // }, 1000)



            }

          })

          .catch(function (res) {
            console.log('-----请求发送咨询失败-----', res);
          });

      })

      // 13.1 data-focus
      $('#listright').on('focus', '#f-date', function () {
        $('#sendConsults #selectDate .ts').hide();
      })

      // 13.2 name-focus
      $('#listright').on('focus', '#f-name', function () {
        $('#sendConsults #myNameS .ts').hide();
      })

      // 13.3 email-focus
      $('#listright').on('focus', '#f-email', function () {
        $('#sendConsults #myEmailS .ts').hide();
      })

      // 13.4 phone-focus
      $('#listright').on('focus', '#f-phone', function () {
        $('#sendConsults #myPhoneS .ts').hide();
      })

      // 14 点击日期
      $('#listright').on('click', '.commoDates', function () {
        $('#listright #f-date').focus();
      })


    });
  </script>
</body>

</html>